﻿@using MyHelpers;
@{
    ViewBag.Title = "Alert Box Examples";
}

<h2>@ViewBag.Title</h2>

<h3>The markup</h3>

<div class="alert-box">
    This is a standard alert (div.alert-box).
  					<a href="" class="close">×</a>
</div>

<div class="alert-box success">
    This is a success alert (div.alert-box.success).
  					<a href="" class="close">×</a>
</div>

<div class="alert-box warning">
    This is an warning (div.alert-box.warning).
  					<a href="" class="close">×</a>
</div>

<div class="alert-box info">
    This is a info alert (div.alert-box.info).
  					<a href="" class="close">×</a>
</div>

<h3>Fluent API</h3>
<span>Html.Alert("Message")</span>
@Html.Alert("Message")

<span>Html.Alert("Message").Success()</span>
@Html.Alert("Message").Success()

<span>Html.Alert("Message").Warning()</span>
@Html.Alert("Message").Warning()

<span>Html.Alert("Message").Info()</span>
@Html.Alert("Message").Info()

<span>Html.Alert("No close button").Info().HideCloseButton().Attributes(new { data_special = "SpecialAttribute" })</span>
@Html.Alert("No close button").Info().HideCloseButton().Attributes(new { data_special = "SpecialAttribute" })

<h4>Standard API</h4>

<span>Html.Alert("Another message", hideCloseButton:true)</span>
@Html.Alert("Another message", hideCloseButton:true)

@section scripts
{
    <script>
        //On Page Load
        (function ($) {
            $(function () {
                //Attach plugins
                //Alerts plugin
                $(document).foundationAlerts();
            });
        })(jQuery);
    </script>
}